<template>
    <a-drawer
        id="add_machine_drawer"
        width="60%"
        title="机房管理人员设置"
        placement="right"
        :visible="modal_show"
        @close="onCancle"
        :destroyOnClose="true"
        :body-style="{ paddingBottom: '80px' }"
        :footer-style="{ textAlign: 'right' }"
        >

        <!-- @change="transfer_change" -->
        <a-transfer
            v-model:target-keys="targetKeys"
            v-model:selected-keys="selectedKeys"
            :data-source="person_table_data"
            :one-way="true"
            :titles="['未选择', '已选择']"
            :list-style="{
                width: '800px',
                height: '300px',
            }"
            :showSearch="false"
            :rowKey="record => record['id']"
            :filterOption="filterOption"
            >
            <template #render="item">
                <div>
                    <a-space>
                        <file-outlined v-if="item.political!='中共党员'"/>
                        <span class="custom-item" >{{ item.orgname }} - {{ item.fullname }}</span>
                    </a-space>
                </div>
            </template>
        </a-transfer>
        <template #extra>
            <a-space>
                <a-button @click="onCancle">取消</a-button>
                <a-button type="primary" @click="onConfirm">确认</a-button>
            </a-space>
        </template>

        <edit_machine_rome_person_level></edit_machine_rome_person_level>
    </a-drawer>
</template>
<script>
import { defineAsyncComponent } from 'vue'
export default {
    data() {
        return {
            modal_show: false,
            role:"",
            targetKeys:[],
            oldtargetKeys:[],
            selectedKeys:[],

            person_table_data: [],


            machine_room_value: {

            },

        };
    },
    beforeUnmount() {
        this.$mitt.off('edit_machine_rome_person_drawer');
    },
    components: {
        edit_machine_rome_person_level: defineAsyncComponent(() => import("./edit_machine_rome_person_level.vue")),
    },

    mounted() {
        this.$mitt.on('edit_machine_rome_person_drawer', _value => {
            this.role= _value?.role
            this.machine_room_value=_value?.record
            this.modal_show=true;
            this.get_all_persons();
        });
        this.$mitt.on('edit_machine_rome_person_level_drawer_result', _value => {
            this.onConfirm_levels(_value)
        });
    },
    methods: {
        async get_all_persons(){
            let qs_result = await this.$apis.get_role_users({
                roleid:this.role
            })
            if (qs_result) {
                console.log(qs_result)
                this.person_table_data=qs_result
                this.get_machine_rome_persons()
            }
        },
        async get_machine_rome_persons(){
            this.targetKeys=[]
            this.oldtargetKeys=[]
            let qs_result = await this.$apis.get_room_level({
                uid:"",
                jid:this.machine_room_value["_id"]
            })
            if (qs_result) {
                for (let i = 0; i < qs_result?.length; i++) {
                    this.targetKeys.push(qs_result[i]?.user)
                    this.oldtargetKeys.push({
                        uid:qs_result[i]?.user,
                        level:qs_result[i]?.level,
                    })
                }
            }
        },
        filterOption(inputValue, option){
            return option.name.indexOf(inputValue)>-1
        },
        onCancle(){
            this.modal_show=false
        },
        async onConfirm(){
            // console.log(this.targetKeys)
            let targetPersons=[]
            for (let i = 0; i < this.targetKeys?.length; i++) {
                let one_targetKey=this.targetKeys[i]
                let find_index=this.person_table_data.findIndex((val)=>{
                    return val.id==one_targetKey
                })
                if(find_index>=0){
                    let pf=this.person_table_data[find_index]
                    let find_index2=this.oldtargetKeys.findIndex((val)=>{
                        return val.uid==one_targetKey
                    })
                    let targetPerson={
                        fullname:pf?.fullname,
                        uid:pf?.id,
                        level:"0011"
                    }
                    if(find_index2>=0){
                        targetPerson.level=this.oldtargetKeys[find_index2].level
                    }
                    targetPersons.push(targetPerson)
                }
            }
            //自定义权限
            if(targetPersons?.length>0){
                this.$mitt.emit('edit_machine_rome_person_level_drawer',targetPersons)
            }
            else{
                this.modal_show=false
            }
        },
        async onConfirm_levels(targetPersons){
            for (let i = 0; i < targetPersons?.length; i++) {
                await this.$apis.update_room_level({
                    uid:targetPersons[i].uid,
                    jid:this.machine_room_value["_id"],
                    level:targetPersons[i].level
                })
            }
            for (let i = 0; i < this.oldtargetKeys?.length; i++) {
                let one_old_Key=this.oldtargetKeys[i]
                let indexFind=targetPersons.findIndex((val)=>{
                    return val.uid==one_old_Key?.uid
                })
                if(indexFind<0){
                    await this.$apis.delete_room_level({
                        uid:one_old_Key.uid,
                        jid:this.machine_room_value["_id"],
                    })
                }
            }
            this.$mitt.emit('edit_machine_rome_person_drawer_result', true);
            this.modal_show=false
        }
    },
};
</script>
<style>
.my-form-item{
    margin-bottom: 6px;
}
</style>